<template>
  <div class="">

    <ELTable v-bind="configTable" ref="tableRef">

      <template #buttons="{ deleteAllHandle }">
        <div>
          <el-button type="primary" @click="showAdd">添加</el-button>
        </div>
      </template>
      <template #operate="{ scope, delrow }">
        <div>
          <el-button type="primary" @click="roleChange(scope.row)">修改</el-button>
          <el-button type="danger" @click="delrow(scope.row.id)">删除</el-button>
        </div>
      </template>
    </ELTable>
    <administratorroleAdd v-if="addshow" @close="addClose" :editData="editData"  @add="addsuccess"></administratorroleAdd>
  </div>
</template>

<script lang='ts' setup>
import { ref, watch, reactive } from "vue"
import ELTable, { TableType } from "../../components/ELTable.vue";
import { administratorroleadd, administratorroledelete, administratorrolelist, menulist } from '../../service/administratorrole/administratorrole'
import administratorroleAdd from "../../components/administratorroleAdd.vue";
import  {add}  from '../../service/administratorrole/type'
import { column } from './administratorrole'


const configTable: TableType = reactive({
  column: column,
  isSelection: true,
  loadData: administratorrolelist,
  delDate: administratorroledelete,
  searchParams: {
    state: 0
  }
})
const editData = reactive<add>({
  name: '',
  id: 0,
  menus: []
})
const tableRef = ref()
const addsuccess = () => {
  addshow.value = false
  tableRef.value.searchSubmit()
}
const showAdd = () => {
  editData.id = 0
  editData.menus=[]
  editData.name=''
  addshow.value = true
}
const roleChange = async (scope:any) => {
  editData.id = 0
  editData.menus=[]
  editData.name=''
  let res = await menulist(scope.id)
  editData.id=scope.id
  editData.name=scope.name
  filterId(res.data.list);
  editData.menus=idArr.value as any
  idArr.value = []
  addshow.value = true
}
const idArr = ref<number[]>([])
//过滤id
const filterId = (arr: any) => {
    for (let i = 0; i < arr.length; i++) {
      if (arr[i].checked == 1) {
        console.log("这个被选中了",arr[i].id);
        idArr.value = [...idArr.value,...[arr[i].id]]
      }
      if (arr[i].children!= null) {
        console.log("这个有孩子",arr[i]);
        filterId(arr[i].children)
      }
    }
}

const addshow = ref(false)
const addClose = () => {
  addshow.value = false
}
</script>

<style scoped></style>